import { Form } from 'antd';
import { axconst } from '@/shared/axconst';
import { AxValidator } from '../AxValidator';
import 'braft-editor/dist/index.css';
import BraftEditor from 'braft-editor';

const FormItem = Form.Item;
const {
  inlineFormItemLayout,
  inlineFormItemLayoutAllRowTwo,
  inlineFormItemLayoutAllRowThree,
} = axconst;
/**
 * 自定义CheckboxGroup
 * @param label 标签
 * @param field 字段名称
 * @param value 值
 * @param placeholder 占位符
 * @param hidden 是否隐藏
 */
export function AxBraftEditor(props) {
  const {
    formItemLayoutFromProps = null,
    wholerow,
    hidden,
    label,
    form,
    field,
    value,
    placeholder,
    required,
    validator,
    formItemStyle = null,
    handleReadUeditorValue,
    ...rest
  } = props;
  let formItemLayout = {};
  switch (wholerow) {
    case 'two':
      formItemLayout = { ...inlineFormItemLayoutAllRowTwo };
      break;
    case 'three':
      formItemLayout = { ...inlineFormItemLayoutAllRowThree };
      break;
    default:
      formItemLayout = formItemLayoutFromProps
        ? formItemLayoutFromProps
        : { ...inlineFormItemLayout };
      break;
  }
  const handleChange = v => {
    const h = v.toHTML();
  };
  const uploadFn = v => {};

  return hidden ? null : (
    <FormItem {...formItemLayout} label={label} style={formItemStyle}>
      {form.getFieldDecorator(field, {
        initialValue: BraftEditor.createEditorState(value),
        rules: [
          {
            label: props.label,
            required: props.required,
            validator: validator ? validator : AxValidator,
          },
        ],
      })(
        <BraftEditor
          style={{ border: '1px solid #e8e8e8' }}
          media={{
            allowPasteImage: true, // 是否允许直接粘贴剪贴板图片（例如QQ截图等）到编辑器
            image: true, // 开启图片插入功能
            video: true, // 开启视频插入功能
            audio: true, // 开启音频插入功能
            validateFn: null, // 指定本地校验函数，说明见下文
            // uploadFn: uploadFn, // 指定上传函数，说明见下文
            removeConfirmFn: null, // 指定删除前的确认函数，说明见下文
            onRemove: null, // 指定媒体库文件被删除时的回调，参数为被删除的媒体文件列表(数组)
            onChange: null, // 指定媒体库文件列表发生变化时的回调，参数为媒体库文件列表(数组)
            onInsert: null, // 指定从媒体库插入文件到编辑器时的回调，参数为被插入的媒体文件列表(数组)
          }}
          {...rest}
          // onChange={handleChange}
          // placeholder={placeholder ? placeholder : `请输入${label}`}
          // maxLength={20000}
          // extendControls={extendControls}
          // controls={controls}
          // media={{ uploadFn: this.myUploadFn }}
          // onReachMaxLength={this.handleMaxLength}
        />,
      )}
    </FormItem>
  );
}
